<template>
  <div class="college_detail_wrap">
    <div class="school_top">
      <div class="school_logo_info">
        <img :src="form.logo" alt="" class="is_logo" />
        <div class="is_desc">
          <p>{{ form.name }}</p>
          <p>
            <span v-for="i in form.tags" :key="i"> {{ i }}</span>
          </p>
        </div>
      </div>
      <div class="school_desc_info">
        <div class="desc_info_banner">
          <el-carousel :interval="5000">
            <el-carousel-item v-for="item in form.banner" :key="item">
              <img :src="item" alt="" style="width: 100%; height: 100%" />
              <!-- <h3>{{ item }}</h3> -->
            </el-carousel-item>
          </el-carousel>
        </div>
        <div class="some_desc">
          <div class="rank_desc_info">
            <div class="rank_item">
              <p>{{ form.rk_rank }}</p>
              <p>软科综合</p>
            </div>
            <div class="rank_item">
              <p>{{ form.xyh_rank }}</p>
              <p>校友会综合</p>
            </div>
            <div class="rank_item">
              <p>{{ form.qs_world }}</p>
              <p>QS世界</p>
            </div>
            <div class="rank_item">
              <p>{{ form.us_rank }}</p>
              <p>US世界</p>
            </div>
            <div class="rank_item">
              <p>{{ form.tws_china }}</p>
              <p>泰晤士（大陆）</p>
            </div>
          </div>
          <div class="show_desc">
            <p>
              <svg
                viewBox="64 64 896 896"
                data-icon="global"
                width="1em"
                height="1em"
                fill="currentColor"
                aria-hidden="true"
                focusable="false"
                style="width: 16px; height: 16px; margin-right: 10px"
              >
                <path
                  d="M854.4 800.9c.2-.3.5-.6.7-.9C920.6 722.1 960 621.7 960 512s-39.4-210.1-104.8-288c-.2-.3-.5-.5-.7-.8-1.1-1.3-2.1-2.5-3.2-3.7-.4-.5-.8-.9-1.2-1.4l-4.1-4.7-.1-.1c-1.5-1.7-3.1-3.4-4.6-5.1l-.1-.1c-3.2-3.4-6.4-6.8-9.7-10.1l-.1-.1-4.8-4.8-.3-.3c-1.5-1.5-3-2.9-4.5-4.3-.5-.5-1-1-1.6-1.5-1-1-2-1.9-3-2.8-.3-.3-.7-.6-1-1C736.4 109.2 629.5 64 512 64s-224.4 45.2-304.3 119.2c-.3.3-.7.6-1 1-1 .9-2 1.9-3 2.9-.5.5-1 1-1.6 1.5-1.5 1.4-3 2.9-4.5 4.3l-.3.3-4.8 4.8-.1.1c-3.3 3.3-6.5 6.7-9.7 10.1l-.1.1c-1.6 1.7-3.1 3.4-4.6 5.1l-.1.1c-1.4 1.5-2.8 3.1-4.1 4.7-.4.5-.8.9-1.2 1.4-1.1 1.2-2.1 2.5-3.2 3.7-.2.3-.5.5-.7.8C103.4 301.9 64 402.3 64 512s39.4 210.1 104.8 288c.2.3.5.6.7.9l3.1 3.7c.4.5.8.9 1.2 1.4l4.1 4.7c0 .1.1.1.1.2 1.5 1.7 3 3.4 4.6 5l.1.1c3.2 3.4 6.4 6.8 9.6 10.1l.1.1c1.6 1.6 3.1 3.2 4.7 4.7l.3.3c3.3 3.3 6.7 6.5 10.1 9.6 80.1 74 187 119.2 304.5 119.2s224.4-45.2 304.3-119.2a300 300 0 0 0 10-9.6l.3-.3c1.6-1.6 3.2-3.1 4.7-4.7l.1-.1c3.3-3.3 6.5-6.7 9.6-10.1l.1-.1c1.5-1.7 3.1-3.3 4.6-5 0-.1.1-.1.1-.2 1.4-1.5 2.8-3.1 4.1-4.7.4-.5.8-.9 1.2-1.4a99 99 0 0 0 3.3-3.7zm4.1-142.6c-13.8 32.6-32 62.8-54.2 90.2a444.07 444.07 0 0 0-81.5-55.9c11.6-46.9 18.8-98.4 20.7-152.6H887c-3 40.9-12.6 80.6-28.5 118.3zM887 484H743.5c-1.9-54.2-9.1-105.7-20.7-152.6 29.3-15.6 56.6-34.4 81.5-55.9A373.86 373.86 0 0 1 887 484zM658.3 165.5c39.7 16.8 75.8 40 107.6 69.2a394.72 394.72 0 0 1-59.4 41.8c-15.7-45-35.8-84.1-59.2-115.4 3.7 1.4 7.4 2.9 11 4.4zm-90.6 700.6c-9.2 7.2-18.4 12.7-27.7 16.4V697a389.1 389.1 0 0 1 115.7 26.2c-8.3 24.6-17.9 47.3-29 67.8-17.4 32.4-37.8 58.3-59 75.1zm59-633.1c11 20.6 20.7 43.3 29 67.8A389.1 389.1 0 0 1 540 327V141.6c9.2 3.7 18.5 9.1 27.7 16.4 21.2 16.7 41.6 42.6 59 75zM540 640.9V540h147.5c-1.6 44.2-7.1 87.1-16.3 127.8l-.3 1.2A445.02 445.02 0 0 0 540 640.9zm0-156.9V383.1c45.8-2.8 89.8-12.5 130.9-28.1l.3 1.2c9.2 40.7 14.7 83.5 16.3 127.8H540zm-56 56v100.9c-45.8 2.8-89.8 12.5-130.9 28.1l-.3-1.2c-9.2-40.7-14.7-83.5-16.3-127.8H484zm-147.5-56c1.6-44.2 7.1-87.1 16.3-127.8l.3-1.2c41.1 15.6 85 25.3 130.9 28.1V484H336.5zM484 697v185.4c-9.2-3.7-18.5-9.1-27.7-16.4-21.2-16.7-41.7-42.7-59.1-75.1-11-20.6-20.7-43.3-29-67.8 37.2-14.6 75.9-23.3 115.8-26.1zm0-370a389.1 389.1 0 0 1-115.7-26.2c8.3-24.6 17.9-47.3 29-67.8 17.4-32.4 37.8-58.4 59.1-75.1 9.2-7.2 18.4-12.7 27.7-16.4V327zM365.7 165.5c3.7-1.5 7.3-3 11-4.4-23.4 31.3-43.5 70.4-59.2 115.4-21-12-40.9-26-59.4-41.8 31.8-29.2 67.9-52.4 107.6-69.2zM165.5 365.7c13.8-32.6 32-62.8 54.2-90.2 24.9 21.5 52.2 40.3 81.5 55.9-11.6 46.9-18.8 98.4-20.7 152.6H137c3-40.9 12.6-80.6 28.5-118.3zM137 540h143.5c1.9 54.2 9.1 105.7 20.7 152.6a444.07 444.07 0 0 0-81.5 55.9A373.86 373.86 0 0 1 137 540zm228.7 318.5c-39.7-16.8-75.8-40-107.6-69.2 18.5-15.8 38.4-29.7 59.4-41.8 15.7 45 35.8 84.1 59.2 115.4-3.7-1.4-7.4-2.9-11-4.4zm292.6 0c-3.7 1.5-7.3 3-11 4.4 23.4-31.3 43.5-70.4 59.2-115.4 21 12 40.9 26 59.4 41.8a373.81 373.81 0 0 1-107.6 69.2z"
                ></path>
              </svg>
              <span>官方网址：</span>
              <span>
                <a style="color: #0000e4" target="_blank" :href="form.site">{{
                  form.site
                }}</a>

                <a
                  style="color: #0000e4; margin-left: 10px"
                  target="_blank"
                  :href="form.school_site"
                  >{{ form.school_site }}</a
                >
              </span>
            </p>
            <p>
              <svg
                viewBox="64 64 896 896"
                data-icon="phone"
                width="1em"
                height="1em"
                fill="currentColor"
                aria-hidden="true"
                focusable="false"
                style="width: 16px; height: 16px; margin-right: 10px"
              >
                <path
                  d="M877.1 238.7L770.6 132.3c-13-13-30.4-20.3-48.8-20.3s-35.8 7.2-48.8 20.3L558.3 246.8c-13 13-20.3 30.5-20.3 48.9 0 18.5 7.2 35.8 20.3 48.9l89.6 89.7a405.46 405.46 0 0 1-86.4 127.3c-36.7 36.9-79.6 66-127.2 86.6l-89.6-89.7c-13-13-30.4-20.3-48.8-20.3a68.2 68.2 0 0 0-48.8 20.3L132.3 673c-13 13-20.3 30.5-20.3 48.9 0 18.5 7.2 35.8 20.3 48.9l106.4 106.4c22.2 22.2 52.8 34.9 84.2 34.9 6.5 0 12.8-.5 19.2-1.6 132.4-21.8 263.8-92.3 369.9-198.3C818 606 888.4 474.6 910.4 342.1c6.3-37.6-6.3-76.3-33.3-103.4zm-37.6 91.5c-19.5 117.9-82.9 235.5-178.4 331s-213 158.9-330.9 178.4c-14.8 2.5-30-2.5-40.8-13.2L184.9 721.9 295.7 611l119.8 120 .9.9 21.6-8a481.29 481.29 0 0 0 285.7-285.8l8-21.6-120.8-120.7 110.8-110.9 104.5 104.5c10.8 10.8 15.8 26 13.3 40.8z"
                ></path>
              </svg>
              <span>招生电话：</span><span>{{ form.phone }}</span>
            </p>
            <p>
              <svg
                viewBox="64 64 896 896"
                data-icon="mail"
                width="1em"
                height="1em"
                fill="currentColor"
                aria-hidden="true"
                focusable="false"
                style="width: 16px; height: 16px; margin-right: 10px"
              >
                <path
                  d="M928 160H96c-17.7 0-32 14.3-32 32v640c0 17.7 14.3 32 32 32h832c17.7 0 32-14.3 32-32V192c0-17.7-14.3-32-32-32zm-40 110.8V792H136V270.8l-27.6-21.5 39.3-50.5 42.8 33.3h643.1l42.8-33.3 39.3 50.5-27.7 21.5zM833.6 232L512 482 190.4 232l-42.8-33.3-39.3 50.5 27.6 21.5 341.6 265.6a55.99 55.99 0 0 0 68.7 0L888 270.8l27.6-21.5-39.3-50.5-42.7 33.2z"
                ></path></svg
              ><span>电子邮箱：</span><span>{{ form.email }}</span>
            </p>
          </div>
        </div>
      </div>
    </div>
    <div class="school_menu">
      <div
        class="school_menu_item"
        :class="schoolTypeI === i ? 'active' : ''"
        v-for="(item, i) in schoolType"
        :key="i"
        @click="handleSchoolType(i)"
      >
        {{ item }}
      </div>
    </div>
    <div class="school_info_content">
      <div class="is_content_left">
        <template v-if="schoolTypeI == 0">
          <div class="info_wrap" style="">
            <div>
              <div class="info_item" style="margin-top: 0px">
                <div class="info_title">基本信息</div>
                <div class="doctor_info">
                  <div class="is_item">
                    <div class="is_title">
                      <img
                        src=""
                        alt=""
                      />保研星级
                    </div>
                    <div class="is_rate">
                      <el-rate :value="form.recommend_master_level"></el-rate>
                    </div>
                  </div>
                  <div class="is_item">
                    <div class="is_title">
                      <img
                        src=""
                        alt=""
                      />博士点(一级/二级)
                    </div>
                    <div class="is_shuo">
                      <div>
                        <span>{{ form.num_doctor }}</span
                        >/ -- 个
                      </div>
                      <!---->
                    </div>
                  </div>
                  <div class="is_item">
                    <div class="is_title">
                      <img
                        src=""
                        alt=""
                      />硕士点(一级/二级)
                    </div>
                    <div class="is_shuo">
                      <!---->
                      <div>
                        <span>{{ form.num_master }}</span
                        >/ -- 个
                      </div>
                    </div>
                  </div>
                  <div class="is_item">
                    <div class="is_title">
                      <img
                        src=""
                        alt=""
                      />国家重点学科
                    </div>
                    <div class="is_other">
                      <span>{{ form.num_academician }}</span
                      >个
                    </div>
                  </div>
                </div>
                <div class="desc_info">
                  <div class="is_item">
                    <div class="is_title">
                      <img
                        src=""
                        alt=""
                      /><span class="isss_title">建校时间：</span
                      ><span class="is_descc">{{ form.create_date }}</span>
                    </div>
                  </div>
                  <div class="is_item">
                    <div class="is_title">
                      <img
                        src=""
                        alt=""
                      /><span class="isss_title">占地面积：</span
                      ><span class="is_descc">{{ form.area }}</span>
                    </div>
                  </div>
                  <div class="is_item">
                    <div class="is_title">
                      <img
                        src=""
                        alt=""
                      /><span class="isss_title">主管部门：</span
                      ><span class="is_descc">{{ form.belong }}</span>
                    </div>
                  </div>
                  <div class="is_item">
                    <div class="is_title">
                      <img
                        src=""
                        alt=""
                      /><span class="isss_title">学校地址：</span
                      ><span class="is_descc">{{ form.address }}</span>
                    </div>
                  </div>
                </div>
                <div
                  :class="['content_desc', { expanded: isExpanded }]"
                  ref="content"
                >
                  <span>{{ form.content }}</span>
                  <!-- <span class="content_detils">[详情]</span> -->
                </div>
              </div>
              <div class="info_item">
                <div class="news_title">
                  <span>招生快讯</span
                  ><span @click="handleNewMore"
                    >{{ newMore ? "收起" : "更多" }} &gt;</span
                  >
                </div>
                <div class="news_box" v-loading="newLoading">
                  <div
                    class="news_item"
                    v-for="(item, i) in newsList"
                    :key="i"
                    @click="handleDetails(item, 'new')"
                  >
                    <div class="is_title"><span>· </span> {{ item.title }}</div>
                    <div class="is_time">{{ item.createtime }}</div>
                  </div>
                </div>
                <div class="new_page" v-if="newMore">
                  <el-pagination
                    background
                    layout="prev, pager, next"
                    @current-change="newCurrentPageHandle"
                    :current-page="queryPage.newPage"
                    :page-size="queryPage.newSize"
                    :total="queryPage.newTotal"
                  >
                  </el-pagination>
                </div>
              </div>
              <div class="info_item">
                <div class="news_title">
                  <span>开设专业</span
                  ><span @click="majorMoreHandle">更多 &gt;</span>
                </div>
                <div class="majors_box">
                  <div
                    class="major_item"
                    v-for="(item, i) in majorList"
                    :key="i"
                    @click="handleDetails(item, 'major')"
                  >
                    {{ item.special_name }}
                  </div>
                </div>
              </div>
            </div>
          </div>
        </template>
        <template v-if="schoolTypeI == 1">
          <div
            class="is_all_detail"
            schoolid="140"
            news="[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]"
            majors="[object Object]"
            v-if="schoolTypeI == 1"
          >
            <div>
              <div class="info_item">
                <div class="info_title">
                  <span
                    :class="enrollmentPlanTypeI == item.type ? 'active' : ''"
                    v-for="(item, i) in enrollmentPlanType"
                    :key="i"
                    @click="handleEnrollmentPlan(item)"
                    >{{ item.name }}</span
                  >
                  <!-- <span class="active">招生计划</span
                  ><span class="">历年分数线</span
                  ><span class="active">2024</span><span class="">2023</span
                  ><span class="">2022</span><span class="">2021</span> -->
                </div>
                <div class="is_head el-row" v-loading="planLoadin">
                  <div style="padding-bottom: 20px">
                    <div class="el-col el-col-3" style="text-align: center">
                      年份
                    </div>
                    <div class="el-col el-col-6" style="text-align: center">
                      院校（招生方向）
                    </div>
                    <div class="el-col el-col-6" style="text-align: center">
                      批次
                    </div>
                    <div class="el-col el-col-4" style="text-align: center">
                      科类
                    </div>
                    <div
                      class="el-col el-col-4"
                      style="text-align: center"
                      v-if="enrollmentPlanTypeI != 'fraction'"
                    >
                      录取数
                    </div>
                    <div
                      v-if="enrollmentPlanTypeI == 'fraction'"
                      class="el-col el-col-4"
                      style="text-align: center"
                    >
                      最低分/最低位
                    </div>
                  </div>
                  <div
                    class="is_body el-row"
                    style="color: rgba(0, 0, 0, 0.5)"
                    v-for="(item, i) in enrollmentPlanTypeI == 'fraction'
                      ? enrollmentFractionList
                      : enrollmentPlanList"
                    :key="i"
                  >
                    <div class="el-col el-col-3" style="text-align: center">
                      {{
                        enrollmentPlanTypeI == "fraction"
                          ? item.year || "-"
                          : item.year || "-"
                      }}
                    </div>
                    <div class="el-col el-col-6" style="text-align: center">
                      {{
                        enrollmentPlanTypeI == "fraction"
                          ? item.name || "-"
                          : item.name || "-"
                      }}
                    </div>
                    <div class="el-col el-col-6" style="text-align: center">
                      {{
                        enrollmentPlanTypeI == "fraction"
                          ? item.level_name || "-"
                          : item.local_batch_name || "-"
                      }}
                    </div>
                    <div class="el-col el-col-4" style="text-align: center">
                      {{
                        enrollmentPlanTypeI == "fraction"
                          ? item.batch_name || "-"
                          : item.sg_info || "-"
                      }}
                    </div>
                    <div
                      v-if="enrollmentPlanTypeI != 'fraction'"
                      class="el-col el-col-4"
                      style="text-align: center"
                    >
                      {{ item.num || "-" }}
                    </div>
                    <div
                      v-if="enrollmentPlanTypeI == 'fraction'"
                      class="el-col el-col-4"
                      style="text-align: center"
                    >
                      {{ item.min_score || "-" + "/" + item.min_rank || "-" }}
                    </div>
                  </div>
                </div>
                <div class="new_page" style="margin-top: 20px">
                  <el-pagination
                    background
                    layout="prev, pager, next"
                    @current-change="enrollmentCurrentHandle"
                    :current-page="
                      enrollmentPlanTypeI == 'fraction'
                        ? queryPage.fractionPage
                        : queryPage.enrollmentPlanPage
                    "
                    :page-size="
                      enrollmentPlanTypeI == 'fraction'
                        ? queryPage.fractionSize
                        : queryPage.enrollmentPlanSize
                    "
                    :total="
                      enrollmentPlanTypeI == 'fraction'
                        ? queryPage.fractionTotal
                        : queryPage.enrollmentPlanTotal
                    "
                  >
                  </el-pagination>
                </div>
              </div>
            </div>
          </div>
        </template>
        <template v-if="schoolTypeI == 2">
          <div class="is_all_detail" v-loading="majorLoading">
            <div>
              <div class="info_item">
                <div class="info_title">开设专业</div>
                <div class="is_body">
                  <div class="is_head el-row">
                    <div class="el-col el-col-6">专业名称</div>
                    <div class="el-col el-col-3">层次</div>
                    <div class="el-col el-col-5">学科门类</div>
                    <div class="el-col el-col-4">专业类别</div>
                    <div class="el-col el-col-3">学制</div>
                    <div class="el-col el-col-3">操作</div>
                  </div>
                  <template v-for="(item, i) in majorList">
                    <div class="is_content el-row" :key="i">
                      <div class="el-col el-col-6">{{ item.special_name }}</div>
                      <div class="el-col el-col-3">{{ item.type_name }}</div>
                      <div class="el-col el-col-5">{{ item.level2_name }}</div>
                      <div class="el-col el-col-4">{{ item.level3_name }}</div>
                      <div class="el-col el-col-3">{{ item.limit_year }}</div>
                      <div class="el-col el-col-3">
                        <div class="isPO" @click="handleDetails(item, 'major')">
                          详情
                        </div>
                      </div>
                    </div>
                  </template>
                </div>
                <div class="new_page">
                  <el-pagination
                    background
                    layout="prev, pager, next"
                    @current-change="majorPageHandle"
                    :current-page="queryPage.majorPage"
                    :page-size="queryPage.majorPageSize"
                    :total="queryPage.majorTotal"
                  >
                  </el-pagination>
                </div>
              </div>
            </div>
          </div>
        </template>
      </div>
      <div class="is_content_right">
        <div class="isbox">
          <div class="all_title">推荐院校</div>
          <div class="school_info">
            <div
              class="school_item"
              v-for="(item, i) in recommendSchoolList"
              :key="i"
              @click="handleSchool(item)"
            >
              <div class="isNums">{{ i + 1 }}.</div>
              <!---->
              <div class="badge_item_name">{{ item.name }}</div>
            </div>
          </div>
        </div>
        <div class="job_box">
          <div class="all_title">毕业去向落实率</div>
          <div class="job_info">
            <div class="job_item">
              <div
                role="progressbar"
                aria-valuenow="96.9"
                aria-valuemin="0"
                aria-valuemax="100"
                class="el-progress el-progress--circle"
              >
                <div
                  class="el-progress-circle"
                  style="height: 80px; width: 80px"
                >
                  <svg viewBox="0 0 100 100">
                    <path
                      d="
        M 50 50
        m 0 -46
        a 46 46 0 1 1 0 92
        a 46 46 0 1 1 0 -92
        "
                      stroke="#ebeef5"
                      stroke-width="7.5"
                      fill="none"
                      class="el-progress-circle__track"
                      style="
                        stroke-dasharray: 289.027px, 289.027px;
                        stroke-dashoffset: 0px;
                      "
                    ></path>
                    <path
                      d="
        M 50 50
        m 0 -46
        a 46 46 0 1 1 0 92
        a 46 46 0 1 1 0 -92
        "
                      stroke="#fe9e0f"
                      fill="none"
                      stroke-linecap="round"
                      stroke-width="7.5"
                      class="el-progress-circle__path"
                      style="
                        stroke-dasharray: 280.067px, 289.027px;
                        stroke-dashoffset: 0px;
                        transition: stroke-dasharray 0.6s, stroke 0.6s;
                      "
                    ></path>
                  </svg>
                </div>
                <div
                  class="el-progress__text"
                  style="font-size: 10.8889px; color: rgb(96, 98, 102)"
                >
                  96.9%
                </div>
              </div>
              <p>毕业去向落实率</p>
            </div>
            <div class="job_item">
              <div
                role="progressbar"
                aria-valuenow="65.6"
                aria-valuemin="0"
                aria-valuemax="100"
                class="el-progress el-progress--circle"
              >
                <div
                  class="el-progress-circle"
                  style="height: 80px; width: 80px"
                >
                  <svg viewBox="0 0 100 100">
                    <path
                      d="
        M 50 50
        m 0 -46
        a 46 46 0 1 1 0 92
        a 46 46 0 1 1 0 -92
        "
                      stroke="#ebeef5"
                      stroke-width="7.5"
                      fill="none"
                      class="el-progress-circle__track"
                      style="
                        stroke-dasharray: 289.027px, 289.027px;
                        stroke-dashoffset: 0px;
                      "
                    ></path>
                    <path
                      d="
        M 50 50
        m 0 -46
        a 46 46 0 1 1 0 92
        a 46 46 0 1 1 0 -92
        "
                      stroke="#04b756"
                      fill="none"
                      stroke-linecap="round"
                      stroke-width="7.5"
                      class="el-progress-circle__path"
                      style="
                        stroke-dasharray: 189.601px, 289.027px;
                        stroke-dashoffset: 0px;
                        transition: stroke-dasharray 0.6s, stroke 0.6s;
                      "
                    ></path>
                  </svg>
                </div>
                <div
                  class="el-progress__text"
                  style="font-size: 10.8889px; color: rgb(96, 98, 102)"
                >
                  65.6%
                </div>
              </div>
              <p>国内升学率</p>
            </div>
            <div class="job_item">
              <div
                role="progressbar"
                aria-valuenow="14"
                aria-valuemin="0"
                aria-valuemax="100"
                class="el-progress el-progress--circle"
              >
                <div
                  class="el-progress-circle"
                  style="height: 80px; width: 80px"
                >
                  <svg viewBox="0 0 100 100">
                    <path
                      d="
        M 50 50
        m 0 -46
        a 46 46 0 1 1 0 92
        a 46 46 0 1 1 0 -92
        "
                      stroke="#ebeef5"
                      stroke-width="7.5"
                      fill="none"
                      class="el-progress-circle__track"
                      style="
                        stroke-dasharray: 289.027px, 289.027px;
                        stroke-dashoffset: 0px;
                      "
                    ></path>
                    <path
                      d="
        M 50 50
        m 0 -46
        a 46 46 0 1 1 0 92
        a 46 46 0 1 1 0 -92
        "
                      stroke="#2198ff"
                      fill="none"
                      stroke-linecap="round"
                      stroke-width="7.5"
                      class="el-progress-circle__path"
                      style="
                        stroke-dasharray: 40.4637px, 289.027px;
                        stroke-dashoffset: 0px;
                        transition: stroke-dasharray 0.6s, stroke 0.6s;
                      "
                    ></path>
                  </svg>
                </div>
                <div
                  class="el-progress__text"
                  style="font-size: 10.8889px; color: rgb(96, 98, 102)"
                >
                  14%
                </div>
              </div>
              <p>出国率</p>
            </div>
          </div>
        </div>
      </div>
      <el-dialog
        :title="contentTitle"
        :visible.sync="newDetailsDialog"
        width="50%"
      >
        <html class="details_content" v-html="detailsDialogContent"></html>
        <span slot="footer" class="dialog-footer">
          <el-button type="primary" @click="newDetailsDialog = false"
            >确 定</el-button
          >
        </span>
      </el-dialog>
    </div>
  </div>
</template>

<script>
import { mapState } from "vuex";
import {
  schoolDetail,
  getNews,
  schoolMajor,
  getEnrollmentPlan,
  getEnrollmentFraction,
  schoolList,
} from "@/api/index";
import { EventBus } from "@/utils/eventBus";
export default {
  name: "",
  computed: {
    ...mapState({
      device: (state) => state.app.device,
    }),
  },
  data() {
    return {
      newDetailsDialog: false,
      majorLoading: false,
      planLoadin: false,
      schoolType: ["学校概况", "分数/计划", "开设专业"],
      schoolTypeI: 0,
      isExpanded: true, // 控制是否展开
      newMore: false,
      newLoading: false,
      school_id: "",
      form: {},
      newsList: [],
      majorList: [],
      majorTotal: 0,
      majorPage: 0,
      majorPageSize: 10,
      queryPage: {
        newPage: 1,
        newSize: 5,
        newTotal: 0,
        majorPage: 1,
        majorSize: 5,
        majorTotal: 0,
        enrollmentPlanPage: 1,
        enrollmentPlanSize: 20,
        enrollmentPlanTotal: 0,
        fractionPage: 1,
        fractionSize: 20,
        fractionTotal: 0,
      },
      enrollmentPlanList: [],
      enrollmentFractionList: [],
      enrollmentPlanType: [
        { type: "plan", name: "招生计划" },
        { type: "fraction", name: "历年分数线" },
        { type: "2024", name: "2024" },
        { type: "2023", name: "2023" },
        { type: "2022", name: "2022" },
        { type: "2021", name: "2021" },
      ],
      enrollmentPlanTypeI: "plan",
      detailsDialogContent: "",
      contentTitle: "",
      recommendSchoolList: [],
    };
  },
  $route(to, from) {},
  created() {
    this.school_id = this.$route.query.id;
    this.getSchoolList();
    this.getList(this.$route.query.id);
    this.getNewsList(this.$route.query.id);
    this.getSchoolMajorList(this.$route.query.id);
    this.schoolTypeI = 0;
    EventBus.$on("schoolDetails", (data) => {
      this.enrollmentFractionList = [];
      this.enrollmentPlanList = [];
      this.enrollmentPlanTypeI = "plan";
      this.schoolTypeI = 0;
      this.school_id = data;
      this.getList(data);
      this.getNewsList(data);
      this.getSchoolMajorList(data);
      this.getSchoolList();
    });
  },
  mounted() {},
  methods: {
    handleSchool(item) {
      this.schoolTypeI = 0;
      this.enrollmentPlanTypeI = "plan";
      this.school_id = item.school_id;
      this.getList(item.school_id);
      this.getNewsList(item.school_id);
      this.getSchoolMajorList(item.school_id);
    },
    /*
     * author：Gengbaodada
     * create by date：2025/05/07
     * content：获取推荐大学
     */
    getSchoolList() {
      schoolList({
        is_recommend: 1,
        qj: "",
        double_high: "",
        central: "",
        department: "",
        dual_class: "",
        f211: "",
        f985: "",
        year: "",
        max_score: "",
        min_score: "",
        school_nature: "",
        school_type: "",
        school_name: "",
        page: 1,
        pageSize: 20,
        province: "",
      }).then((res) => {
        console.log("res", res);
        this.recommendSchoolList = res.data.data;
      });
    },
    /*
     * author：Gengbaodada
     * create by date：2025/05/07
     * content：打开详情弹窗
     */
    handleDetails(item, type) {
      this.contentTitle = type == "major" ? "专业详情" : "快讯详情";
      this.detailsDialogContent = item.content;
      this.newDetailsDialog = true;
    },
    /*
     * author：Gengbaodada
     * create by date：2025/05/07
     * content：计划分数分页函数
     */
    enrollmentCurrentHandle(val) {
      this.enrollmentPlanTypeI == "fraction"
        ? (this.queryPage.fractionPage = val)
        : (this.queryPage.enrollmentPlanPage = val);
      this.enrollmentPlanTypeI == "fraction"
        ? this.getEnrollmentFractionList(this.school_id)
        : this.getEnrollmentPlanList(this.school_id);
    },
    /*
     * author：Gengbaodada
     * create by date：2025/05/07
     * content：获取历年分数线
     */
    getEnrollmentFractionList(id) {
      this.planLoadin = true;
      getEnrollmentFraction({
        school_id: id,
        page: this.queryPage.fractionPage,
        pageSize: this.queryPage.fractionSize,
      }).then((res) => {
        this.queryPage.fractionTotal = res.data.total;
        this.enrollmentFractionList = res.data.data;
        this.planLoadin = false;
      });
    },
    /*
     * author：Gengbaodada
     * create by date：2025/05/07
     * content：切换招生计划类型
     */
    handleEnrollmentPlan(item) {
      this.queryPage.enrollmentPlanPage = 1;
      this.queryPage.fractionPage = 1;
      this.enrollmentPlanTypeI = item.type;
      if (item.type === "fraction") {
        this.enrollmentPlanType = [
          { type: "plan", name: "招生计划" },
          { type: "fraction", name: "历年分数线" },
        ];
        this.getEnrollmentFractionList(this.school_id);
      } else {
        this.enrollmentPlanType = [
          { type: "plan", name: "招生计划" },
          { type: "fraction", name: "历年分数线" },
          { type: "2024", name: "2024" },
          { type: "2023", name: "2023" },
          { type: "2022", name: "2022" },
          { type: "2021", name: "2021" },
        ];
        this.getEnrollmentPlanList(
          this.school_id,
          item.type == "plan" ? "" : item.type
        );
      }
    },
    /*
     * author：Gengbaodada
     * create by date：2025/05/07
     * content：获取招生计划列表
     */
    getEnrollmentPlanList(id, year) {
      this.planLoadin = true;
      getEnrollmentPlan({
        year: year,
        school_id: id,
        page: this.queryPage.enrollmentPlanPage,
        pageSize: this.queryPage.enrollmentPlanSize,
      }).then((res) => {
        this.queryPage.enrollmentPlanTotal = res.data.total;
        this.enrollmentPlanList = res.data.data;
        this.planLoadin = false;
      });
    },
    /*
     * author：Gengbaodada
     * create by date：2025/05/06
     * content：学科分页
     */
    majorPageHandle(val) {
      this.queryPage.majorPage = val;
      this.getSchoolMajorList(this.school_id);
    },
    /*
     * author：Gengbaodada
     * create by date：2025/05/06
     * content：切换tab
     */
    handleSchoolType(i) {
      this.majorList = [];
      this.schoolTypeI = i;
      if (i == 2) {
        this.queryPage.majorPageSize = 10;
        this.getSchoolMajorList(this.school_id);
      } else if (i == 1) {
        this.getEnrollmentPlanList(this.school_id, "");
      } else {
        this.queryPage.majorPageSize = 25;
        this.getSchoolMajorList(this.school_id);
      }
    },
    /*
     * author：Gengbaodada
     * create by date：2025/05/06
     * content：跳转更多开设专业
     */
    majorMoreHandle() {
      this.majorList = [];
      this.queryPage.majorPageSize = 10;
      this.getSchoolMajorList(this.school_id);
      this.schoolTypeI = 2;
    },
    /*
     * author：Gengbaodada
     * create by date：2025/05/06
     * content：招生快讯分页
     */
    newCurrentPageHandle(val) {
      this.queryPage.newPage = val;
      this.getNewsList(this.school_id);
    },
    /*
     * author：Gengbaodada
     * create by date：2025/05/06
     * content：查询更多招生快讯
     */
    async handleNewMore() {
      this.newLoading = true;
      this.queryPage.newSize = this.newMore ? 5 : 10;
      await this.getNewsList(this.school_id);
      this.newMore = !this.newMore;
    },
    /*
     * author：Gengbaodada
     * create by date：2025/05/06
     * content：获取招生快讯列表
     */
    async getNewsList(id) {
      return new Promise((resolve, reject) => {
        getNews({
          school_id: id,
          page: this.queryPage.newPage,
          pageSize: this.queryPage.newSize,
        }).then((response) => {
          this.queryPage.newTotal = response.data.total;
          this.newsList = response.data.data;
          this.newLoading = false;
          resolve();
        });
      });
    },
    /*
     * author：Gengbaodada
     * create by date：2025/05/06
     * content：获取开设专业列表
     */
    getSchoolMajorList(id) {
      this.majorLoading = true;
      schoolMajor({
        school_id: id,
        page: this.queryPage.majorPage,
        pageSize: this.queryPage.majorPageSize,
      }).then((response) => {
        this.majorList = response.data.data;
        this.queryPage.majorTotal = response.data.total;
        this.majorLoading = false;
      });
    },
    /*
     * author：Gengbaodada
     * create by date：2025/05/06
     * content：获取学校详情
     */
    getList(id) {
      schoolDetail({ school_id: id }).then((response) => {
        this.form = response.data;
        this.form.tags = response.data.tags.split(",");
        this.form.banner = response.data.banner.split(",");
      });
    },
  },
};
</script>

<style scoped lang="scss">
.details_content {
  max-height: 500px;
  overflow-y: scroll;
  font-size: 16px;
}
.new_page {
  margin-top: 10px;
  text-align: right;
}
.college_detail_wrap {
  width: 1450px;
  margin: 10px auto 0;
}

.college_detail_wrap .school_top {
  padding: 20px;
  box-sizing: border-box;
  background-color: #fff;
  border-radius: 8px;
}

.college_detail_wrap .school_top .school_logo_info {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px;
  border-bottom: 1px solid #f5f5f5;
}

.college_detail_wrap .school_top .school_logo_info .is_logo {
  width: 80px;
  height: 80px;
  margin-right: 20px;
  border-radius: 50%;
}

.college_detail_wrap .school_top .school_logo_info .is_desc {
  flex: 1;
  height: 80px;
}

.college_detail_wrap .school_top .school_logo_info .is_desc p:first-child {
  font-size: 18px;
  font-weight: 600;
}

.college_detail_wrap .school_top .school_logo_info .is_desc p:nth-child(2) {
  margin-top: 10px;
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
}

.college_detail_wrap
  .school_top
  .school_logo_info
  .is_desc
  p:nth-child(2)
  span {
  display: inline-block;
  padding: 3px 8px;
  background-color: #f6f7f7;
  color: #919294;
  border-radius: 3px;
  margin-right: 10px;
  margin-top: 5px;
}

.college_detail_wrap .school_top .school_desc_info {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 20px;
}
::v-deep .el-carousel--horizontal,
::v-deep .el-carousel__container {
  height: 100%;
}
.college_detail_wrap .school_top .school_desc_info .desc_info_banner {
  width: 442px;
  height: 254px;
  border-radius: 5px;
  margin-right: 20px;
}

.college_detail_wrap .school_top .school_desc_info .desc_info_banner img {
  width: 100%;
  height: 100%;
  border-radius: 5px;
}

.college_detail_wrap .school_top .school_desc_info .some_desc {
  flex: 1;
  height: 254px;
}

.college_detail_wrap .school_top .school_desc_info .some_desc .rank_desc_info {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-right: 20px;
}

.college_detail_wrap
  .school_top
  .school_desc_info
  .some_desc
  .rank_desc_info
  .rank_item {
  width: 109px;
  height: 54px;
  background: #fff9f2;
  border-radius: 8px;
  border: 1px solid #fff0e6;
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
}

.college_detail_wrap
  .school_top
  .school_desc_info
  .some_desc
  .rank_desc_info
  .rank_item
  p:first-child {
  font-size: 18px;
  color: #f60;
}

.college_detail_wrap
  .school_top
  .school_desc_info
  .some_desc
  .rank_desc_info
  .rank_item
  p:nth-child(2) {
  color: #666;
  font-size: 14px;
  line-height: 16px;
  padding: 0 4px;
  text-align: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.college_detail_wrap .school_top .school_desc_info .some_desc .show_desc {
  padding-top: 30px;
}

.college_detail_wrap .school_top .school_desc_info .some_desc .show_desc p {
  font-size: 14px;
  color: #222224;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  margin: 20px 0;
}

.college_detail_wrap
  .school_top
  .school_desc_info
  .some_desc
  .show_desc
  p
  span {
  display: inline-block;
  margin-right: 10px;
}

.college_detail_wrap .school_menu {
  width: 100%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  border-bottom: 2px solid #fe6e13;
  margin-top: 20px;
}

.college_detail_wrap .school_menu .school_menu_item {
  width: 200px;
  height: 49px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 18px;
  cursor: pointer;
}

.college_detail_wrap .school_menu .school_menu_item:hover {
  color: #ff882a;
}

.college_detail_wrap .school_menu .active {
  background: linear-gradient(91deg, #ff882a, #f60 99.9%);
  border-radius: 8px 8px 0 0;
  color: #fff !important;
}

.college_detail_wrap .school_info_content {
  width: 100%;
  display: flex;
  justify-content: center;
  margin-top: 20px;
}

.college_detail_wrap .school_info_content .is_content_right {
  width: 380px;
  margin-left: 20px;
}

.college_detail_wrap .school_info_content .is_content_right .isbox {
  width: 100%;
  background-color: #fff;
  padding: 20px;
  box-sizing: border-box;
  border-radius: 8px;
}

.college_detail_wrap
  .school_info_content
  .is_content_right
  .isbox
  .school_info {
  width: 100%;
}

.college_detail_wrap
  .school_info_content
  .is_content_right
  .isbox
  .school_info
  .school_item {
  display: flex;
  justify-content: space-between;
  font-size: 16px;
  margin-top: 10px;
  cursor: pointer;
}

.college_detail_wrap
  .school_info_content
  .is_content_right
  .isbox
  .school_info
  .school_item
  .isNums {
  font-weight: 600;
}

.college_detail_wrap
  .school_info_content
  .is_content_right
  .isbox
  .school_info
  .school_item
  .isImgss {
  width: 24px;
  height: 24px;
  margin-right: 10px;
  border-radius: 50%;
}

.college_detail_wrap
  .school_info_content
  .is_content_right
  .isbox
  .school_info
  .school_item
  .badge_item_name {
  flex: 1;
  color: #222224;
  font-weight: 600;
}

.college_detail_wrap .school_info_content .is_content_right .job_box {
  width: 100%;
  border-radius: 8px;
  background-color: #fff;
  padding: 20px;
  margin-top: 20px;
}

.college_detail_wrap .school_info_content .is_content_right .job_box .job_info {
  display: flex;
  justify-content: space-around;
  align-items: center;
  margin-top: 20px;
}

.college_detail_wrap
  .school_info_content
  .is_content_right
  .job_box
  .job_info
  .job_item {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.college_detail_wrap
  .school_info_content
  .is_content_right
  .job_box
  .job_info
  .job_item
  p {
  margin-top: 10px;
}

.college_detail_wrap .school_info_content .is_content_right .all_title {
  font-size: 20px;
  font-weight: 700;
}

.college_detail_wrap .school_info_content .is_content_left {
  flex: 1;
}

.info_wrap {
  width: 100%;
}

.info_wrap .info_item {
  padding: 20px;
  background-color: #fff;
  border-radius: 8px;
  margin-top: 20px;
}

.info_wrap .info_item .is_page {
  margin-top: 20px;
  width: 100%;
  display: flex;
  justify-content: center;
  align-content: center;
}

.info_wrap .info_item .is_titl11e {
  width: 100%;
  font-size: 24px;
  color: rgba(0, 0, 0, 0.88);
  text-align: center;
  margin-bottom: 30px;
  margin-top: 20px;
}

.info_wrap .info_item .info_title {
  font-size: 14px;
  font-weight: 600;
  color: #333;
}

.info_wrap .info_item .news_title {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.info_wrap .info_item .news_title span:first-child {
  font-size: 14px;
  font-weight: 600;
  color: #333;
}

.info_wrap .info_item .news_title span:nth-child(2) {
  color: #f60;
  cursor: pointer;
}

.info_wrap .info_item .desc_info,
.info_wrap .info_item .doctor_info {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 20px;
}

.info_wrap .info_item .desc_info .is_item,
.info_wrap .info_item .doctor_info .is_item {
  background: linear-gradient(0deg, #f8f8f8, #f8f8f8);
  width: 23%;
  text-align: left;
  padding: 15px;
  margin-right: 10px;
  border-radius: 4px;
}

.info_wrap .info_item .desc_info .is_item .is_title,
.info_wrap .info_item .doctor_info .is_item .is_title {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  font-size: 14px;
}

.info_wrap .info_item .desc_info .is_item .is_title .isss_title,
.info_wrap .info_item .doctor_info .is_item .is_title .isss_title {
  display: inline-block;
  width: 80px;
}

.info_wrap .info_item .desc_info .is_item .is_title img,
.info_wrap .info_item .doctor_info .is_item .is_title img {
  width: 18px;
  height: 18px;
  margin-right: 9px;
}

.info_wrap .info_item .desc_info .is_item .is_rate,
.info_wrap .info_item .doctor_info .is_item .is_rate {
  margin-top: 20px;
}

.info_wrap .info_item .desc_info .is_item .is_shuo,
.info_wrap .info_item .doctor_info .is_item .is_shuo {
  font-size: 14px;
  color: #999;
  margin-top: 12px;
}

.info_wrap .info_item .desc_info .is_item .is_shuo span,
.info_wrap .info_item .doctor_info .is_item .is_shuo span {
  font-size: 24px;
  color: #000;
}

.info_wrap .info_item .desc_info .is_item .is_other,
.info_wrap .info_item .doctor_info .is_item .is_other {
  color: #999;
  margin-top: 12px;
}

.info_wrap .info_item .desc_info .is_item .is_other span,
.info_wrap .info_item .doctor_info .is_item .is_other span {
  color: #000;
  font-size: 24px;
}

.info_wrap .info_item .desc_info {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
  border-radius: 4px;
  background: linear-gradient(0deg, #f8f8f8, #f8f8f8);
}

.info_wrap .info_item .desc_info .is_item {
  width: 45%;
  min-width: 340px;
}

.info_wrap .info_item .desc_info .is_item .is_title .is_descc {
  display: inline-block;
  width: 200px;
}

.info_wrap .info_item .news_box {
  font-size: 16px;
}

.info_wrap .info_item .news_box .news_item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 5px 0;
  cursor: pointer;
}

.info_wrap .info_item .news_box .news_item .is_title {
  display: flex;
  justify-content: flex-start;
  align-items: center;
}

.info_wrap .info_item .news_box .news_item .is_title span {
  font-size: 20px;
  font-weight: 900;
  color: #f60;
  display: inline-block;
  margin-right: 3px;
}

.info_wrap .info_item .news_box .news_item:hover {
  color: #f60;
}

.info_wrap .info_item .majors_box {
  margin-top: 10px;
  font-size: 14px;
  color: #666;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
}

.info_wrap .info_item .majors_box .major_item {
  margin-right: 10px;
  margin: 5px 10px 5px 0;
  cursor: pointer;
}

.info_wrap .info_item .majors_box .major_item:hover {
  color: #f60;
}

.info_wrap .info_item .content_desc {
  width: 100%;
  color: #666;
  //   font-size: 14px;
  margin-top: 20px;
  overflow: hidden;
  line-height: 1.6;
  max-height: 3.2em; /* 显示两行 */
  transition: max-height 0.3s ease-out; /* 增加过渡动画 */
}

.info_wrap .info_item .content_desc.expanded {
  max-height: 1000px; /* 展开时的最大高度 */
  overflow-y: auto; /* 添加滚动条 */
}

.info_wrap .info_item .content_desc iframe {
  width: 100%;
  height: 100%;
}

.info_wrap .info_item .content_desc span:nth-child(2) {
  color: #f60;
  cursor: pointer;
}

.el-rate__icon {
  font-size: 22px;
}

.is_all_detail {
  width: 100%;
}

.is_all_detail .info_item {
  padding: 20px;
  background-color: #fff;
  border-radius: 8px;
}

.is_all_detail .info_item .info_title {
  font-size: 14px;
  font-weight: 600;
  color: rgb(51, 51, 51);
}

.is_all_detail .info_item .is_titl11e {
  width: 100%;
  font-size: 16px;
  color: rgba(0, 0, 0, 0.88);
  text-align: left;
  margin-bottom: 30px;
  margin-top: 20px;
}

.el-pagination.is-background .el-pager li:not(.disabled).active {
  background-color: #f60;
}

.el-pagination.is-background .el-pager:hover {
  color: #f60 !important;
}

.is_all_detail {
  width: 100%;
}

.is_all_detail .info_item {
  padding: 20px;
  background-color: #fff;
  border-radius: 8px;
}

.is_all_detail .info_item .isPO {
  color: #f60;
  font-weight: 600;
  cursor: pointer;
}

.is_all_detail .info_item .is_titl11e {
  width: 100%;
  font-size: 16px;
  color: rgba(0, 0, 0, 0.88);
  text-align: left;
  margin-bottom: 30px;
  margin-top: 20px;
}

.is_all_detail .info_item .info_title {
  font-size: 14px;
  font-weight: 600;
  color: rgb(51, 51, 51);
}

.is_all_detail .info_item .is_body {
  margin-top: 20px;
  font-size: 14px;
  font-weight: 500;
  color: #ccc;
}

.is_all_detail .info_item .is_head {
  border-bottom: 1px solid #f6f7f7;
  font-size: 16px;
  font-weight: bold;
  padding: 20px 0;
}

.is_all_detail .info_item .is_body .is_content {
  color: #000;
  padding: 10px 0;
  border-bottom: 1px solid #f6f7f7;
}

.is_all_detail .info_item .is_page {
  margin-top: 20px;
  width: 100%;
  display: flex;
  justify-content: center;
  align-content: center;
}

.el-pagination.is-background .el-pager li:not(.disabled).active {
  background-color: #f60;
}

.el-pagination.is-background .el-pager:hover {
  color: #f60 !important;
}

.is_all_detail {
  width: 100%;
}

.is_all_detail .info_item {
  padding: 20px;
  background-color: #fff;
  border-radius: 8px;
}

.is_all_detail .info_item .isPO {
  color: #f60;
  font-weight: 600;
  cursor: pointer;
}

.is_all_detail .info_item .is_titl11e {
  width: 100%;
  font-size: 16px;
  color: rgba(0, 0, 0, 0.88);
  text-align: left;
  margin-bottom: 30px;
  margin-top: 20px;
}

.is_all_detail .info_item .info_title {
  font-size: 14px;
  font-weight: 600;
  color: rgb(51, 51, 51);
}

.is_all_detail .info_item .info_title span {
  display: inline-block;
  padding: 0 10px;
  margin-right: 20px;
  cursor: pointer;
}

.is_all_detail .info_item .info_title .active {
  color: #f60;
}

.is_all_detail .info_item .is_body {
  margin-top: 20px;
  font-size: 14px;
  font-weight: 500;
  color: #ccc;
}

.is_all_detail .info_item .is_body .is_head {
  border-bottom: 1px solid #f6f7f7;
  padding: 5px 0;
  color: rgb(0, 0, 0, 0.5);
  font-weight: 700;
}

.is_all_detail .info_item .is_body .is_content {
  color: #000;
  padding: 10px 0;
  border-bottom: 1px solid #f6f7f7;
}

.is_all_detail .is_page {
  margin-top: 20px;
  width: 100%;
  display: flex;
  justify-content: flex-end;
  align-content: center;
}

.el-carousel__container {
  height: 254px;
}

.college_detail_wrap {
  width: 1450px;
  margin: 10px auto 0;
}

.college_detail_wrap .school_top {
  padding: 20px;
  box-sizing: border-box;
  background-color: #fff;
  border-radius: 8px;
}

.college_detail_wrap .school_top .school_logo_info {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px;
  border-bottom: 1px solid #f5f5f5;
}

.college_detail_wrap .school_top .school_logo_info .is_logo {
  width: 80px;
  height: 80px;
  margin-right: 20px;
  border-radius: 50%;
}

.college_detail_wrap .school_top .school_logo_info .is_desc {
  flex: 1;
  height: 80px;
}

.college_detail_wrap .school_top .school_logo_info .is_desc p:first-child {
  font-size: 18px;
  font-weight: 600;
}

.college_detail_wrap .school_top .school_logo_info .is_desc p:nth-child(2) {
  margin-top: 10px;
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
}

.college_detail_wrap
  .school_top
  .school_logo_info
  .is_desc
  p:nth-child(2)
  span {
  display: inline-block;
  padding: 3px 8px;
  background-color: #f6f7f7;
  color: #919294;
  border-radius: 3px;
  margin-right: 10px;
  margin-top: 5px;
}

.college_detail_wrap .school_top .school_desc_info {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 20px;
}

.college_detail_wrap .school_top .school_desc_info .desc_info_banner {
  width: 442px;
  height: 254px;
  border-radius: 5px;
  margin-right: 20px;
}

.college_detail_wrap .school_top .school_desc_info .desc_info_banner img {
  width: 100%;
  height: 100%;
  border-radius: 5px;
}

.college_detail_wrap .school_top .school_desc_info .some_desc {
  flex: 1;
  height: 254px;
}

.college_detail_wrap .school_top .school_desc_info .some_desc .rank_desc_info {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.college_detail_wrap
  .school_top
  .school_desc_info
  .some_desc
  .rank_desc_info
  .rank_item {
  width: 109px;
  height: 54px;
  background: #fff9f2;
  border-radius: 8px;
  border: 1px solid #fff0e6;
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
}

.college_detail_wrap
  .school_top
  .school_desc_info
  .some_desc
  .rank_desc_info
  .rank_item
  p:first-child {
  font-size: 18px;
  color: #f60;
}

.college_detail_wrap
  .school_top
  .school_desc_info
  .some_desc
  .rank_desc_info
  .rank_item
  p:nth-child(2) {
  color: #666;
  font-size: 14px;
  line-height: 16px;
  padding: 0 4px;
  text-align: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.college_detail_wrap .school_top .school_desc_info .some_desc .show_desc {
  padding-top: 30px;
}

.college_detail_wrap .school_top .school_desc_info .some_desc .show_desc p {
  font-size: 14px;
  color: #222224;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  margin: 20px 0;
}

.college_detail_wrap
  .school_top
  .school_desc_info
  .some_desc
  .show_desc
  p
  span {
  display: inline-block;
  margin-right: 10px;
}

.college_detail_wrap .school_menu {
  width: 100%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  border-bottom: 2px solid #fe6e13;
  margin-top: 20px;
}

.college_detail_wrap .school_menu .school_menu_item {
  width: 200px;
  height: 49px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 18px;
  cursor: pointer;
}

.college_detail_wrap .school_menu .school_menu_item:hover {
  color: #ff882a;
}

.college_detail_wrap .school_menu .active {
  background: linear-gradient(91deg, #ff882a, #f60 99.9%);
  border-radius: 8px 8px 0 0;
  color: #fff !important;
}

.college_detail_wrap .school_info_content {
  width: 100%;
  display: flex;
  justify-content: center;
  margin-top: 20px;
}

.college_detail_wrap .school_info_content .is_content_right {
  width: 380px;
  margin-left: 20px;
}

.college_detail_wrap .school_info_content .is_content_right .isbox {
  width: 100%;
  background-color: #fff;
  padding: 20px;
  box-sizing: border-box;
  border-radius: 8px;
}

.college_detail_wrap
  .school_info_content
  .is_content_right
  .isbox
  .school_info {
  width: 100%;
}

.college_detail_wrap
  .school_info_content
  .is_content_right
  .isbox
  .school_info
  .school_item {
  display: flex;
  justify-content: space-between;
  font-size: 16px;
  margin-top: 10px;
  cursor: pointer;
}

.college_detail_wrap
  .school_info_content
  .is_content_right
  .isbox
  .school_info
  .school_item
  .isNums {
  font-weight: 600;
}

.college_detail_wrap
  .school_info_content
  .is_content_right
  .isbox
  .school_info
  .school_item
  .isImgss {
  width: 24px;
  height: 24px;
  margin-right: 10px;
  border-radius: 50%;
}

.college_detail_wrap
  .school_info_content
  .is_content_right
  .isbox
  .school_info
  .school_item
  .badge_item_name {
  flex: 1;
  color: #222224;
  font-weight: 600;
}

.college_detail_wrap .school_info_content .is_content_right .job_box {
  width: 100%;
  border-radius: 8px;
  background-color: #fff;
  padding: 20px;
  margin-top: 20px;
}

.college_detail_wrap .school_info_content .is_content_right .job_box .job_info {
  display: flex;
  justify-content: space-around;
  align-items: center;
  margin-top: 20px;
}

.college_detail_wrap
  .school_info_content
  .is_content_right
  .job_box
  .job_info
  .job_item {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.college_detail_wrap
  .school_info_content
  .is_content_right
  .job_box
  .job_info
  .job_item
  p {
  margin-top: 10px;
}

.college_detail_wrap .school_info_content .is_content_right .all_title {
  font-size: 20px;
  font-weight: 700;
}

.college_detail_wrap .school_info_content .is_content_left {
  flex: 1;
}
</style>
